<template>
  <div id="app" class="body">
    <transition :name="transitionName">
      <keep-alive :include="cacheRoutes">
        <router-view />
      </keep-alive>
    </transition>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      transitionName: "",
    };
  },
  created() {
    if (this.$utils.getUrlParam("data")) {
      this.$store.dispatch(`user/${this.$types.LOGOUT}`);
      this.$router.push("/login?data=" + this.$utils.getUrlParam("data"));
    }
  },
  computed: {
    ...mapGetters(["cacheRoutes"]),
  },
  watch: {
    //监听路由变化确定使用哪种过渡动画
    $route(to, from) {
      if (to.meta.index < 40) {
        // 删除缓存中的 预览文件 页面
        this.$store.commit(
          `app/${this.$types.REMOVE_CACHE_ROUTES}`,
          "previewFile"
        );
      }
      const toDepth = to.meta.index;
      const fromDepth = from.meta.index;
      if (toDepth === fromDepth) {
        this.transitionName = "";
      } else {
        this.transitionName =
          toDepth < fromDepth ? "slide-right" : "slide-left";
      }
    },
  },
  methods: {},
};
</script>
<style>
/* @import "../src/assets/fonts/fonts.css"; */
.body{
  /* font-family: 'MSYH', 'Medium'; */
}
</style>
